<html> 
<head>
<title> Molecule Visualizer</title>
<link rel="icon" href="/favicon.ico" type="image/x-icon">
<link rel="shortcut icon" href="favicon.ico" type="image/x-icon">
<link rel="stylesheet" type="text/css" href="site.css"

</head>

<script> 
var gram_mass_sum = 0;
var elements_array = [];
var most_EP = ""; 
function process()
{
	gram_mass_sum = 0;
	var molecule = document.getElementById("Input").value; //input string
	var elem = molecule.split(""); //component element array
	
	var closeparen_positions = []; //positions of ")"
	var indexnum =0; 
	var paren_index = molecule.indexOf(")");
	var index_old =0;
	while (paren_index != -1)
	{
		closeparen_positions[indexnum] = paren_index;
		index_old = (paren_index + 1);
		paren_index = molecule.indexOf(")",index_old);
		indexnum++;
	}
	
	var openparen_positions = []; //positions of "("
	indexnum = 0;
	var paren_index = molecule.indexOf("(");
	index_old = 0;
	while (paren_index != -1)
	{
		openparen_positions[indexnum] = paren_index;
		index_old = (paren_index + 1);
		paren_index = molecule.indexOf("(", index_old);
		indexnum++;
	}

	var closeparen_position_array_size = closeparen_positions.length;
	
	var multipliers = []; //multiplier number (after parantheses) positions
	var i = 0;
	var cur;
	var check;
	for (i=0; i<closeparen_position_array_size; i++)
	{
		cur = molecule.slice((closeparen_positions[i]+1), (closeparen_positions[i]+2));
		intcur = parseInt(cur);
		check = molecule.slice((closeparen_positions[i]+2), (closeparen_positions[i]+3));
		if ((((check.charCodeAt(0))-("0".charCodeAt(0)))>=0) && (((check.charCodeAt(0))-("0".charCodeAt(0)))<=9))
		{
			intcheck = parseInt(check);
			intcur = (intcur*10) + intcheck;
			elem.splice((closeparen_positions[i]+1),2);
		}
		else ((((check.charCodeAt(0))-("0".charCodeAt(0)))<0) || (((check.charCodeAt(0)) - ("0".charCodeAt(0)))>9))
		{
			elem.splice((closeparen_positions[i]+1),1);
		}
		multipliers [i] = intcur;
	}
	
	var start = 0;
	var end = 0 ;
	var j = 0;
	var next;
	var elemindex;
	for (i=0; i<closeparen_position_array_size; i++)
	{
		start = (openparen_positions[i])+1;
		end = closeparen_positions[i];
		
		elemindex=start;
		for (j=start; j<end; j++)
		{
			cur = molecule.slice((j), (j+1));
			next = molecule.slice((j+1),(j+2));
			if ((((next.charCodeAt(0)) - ("a".charCodeAt(0))) <0) && (((next.charCodeAt(0)) - ("a".charCodeAt(0))) >=-32) && (((cur.charCodeAt(0)) - ("0".charCodeAt(0))) >9))
			{
				elem.splice((elemindex+1),0, multipliers[i]);
				elemindex++;
			}
			if ((((next.charCodeAt(0)) - (")".charCodeAt(0))) ==0) && (((cur.charCodeAt(0)) - ("0".charCodeAt(0))) >9))
			{
				elem.splice((elemindex+1),0, multipliers[i]);
				elemindex++;
			}
			if ((((cur.charCodeAt(0))-("0".charCodeAt(0)))>=0) && (((cur.charCodeAt(0))-("0".charCodeAt(0)))<=9))
			{
				intcur = parseInt(cur);
				if ((((next.charCodeAt(0))-("0".charCodeAt(0)))>=0) && (((next.charCodeAt(0))-("0".charCodeAt(0)))<=9))
				{
					intnext = parseInt(next);
					intcur = (intcur*10) + intnext;
				}
				intcur *= multipliers[i];
				elem.splice(elemindex,1);
				elem.splice(elemindex,0,intcur);
			}
			elemindex++;
		}
	}
	for (i=0; i<elem.length; i++) // remove "(" and ")" parantheses from element array
	{
		if ((elem[i] == "(") || (elem[i] == ")"))
		{
			elem.splice(i,1);
		}
	}
	
	
	var cur_index = -1;
	var torepeat;

	for (i=0; i<elem.length; i++)
	{
		if ((isNaN(elem[i]))==true)
		{
			if (((elem[i].charCodeAt(0))-("a".charCodeAt(0))>=0) && ((elem[i].charCodeAt(0))-("a".charCodeAt(0))<=32))
			{
				elements_array[cur_index]+=elem[i];
			}
			if (((elem[i].charCodeAt(0))-("a".charCodeAt(0))<0) && ((elem[i].charCodeAt(0))-("a".charCodeAt(0))>=-32))
			{
				cur_index++;
				elements_array[cur_index] = elem[i];
			}
		}
		else if ((isNaN(elem[i]))==false)
		{
			
			torepeat = elements_array[cur_index];
			for (j=0; j<((elem[i])-1); j++)
			{
				cur_index++;
				elements_array[cur_index] = torepeat;
			}
			
		}
	}

	//document.getElementById("write_elements").innerHTML = elements_array;
	var list_molarmass = [1.0079, 4.0026, 6.941, 9.0122, 10.811, 12.011, 14.007, 15.999, 18.998, 20.180, 22.990, 24.305, 26.982, 28.086, 30.974, 32.065, 35.453, 39.948, 39.098, 40.078, 44.956, 47.867, 50.942, 51.996, 54.938, 55.845, 58.933, 58.693, 63.546, 65.39, 69.723, 72.61, 74.922, 78.96, 79.904, 83.80, 85.468, 87.62, 88.906, 91.224, 92.906, 95.94, 98, 101.07, 102.91, 106.42, 107.87, 112.41, 114.82, 118.71, 121.76, 127.60, 126.90, 131.29, 132.91, 137.33, 138.91, 140.12, 140.91, 144.24, 145, 150.36, 151.96, 157.25, 158.93, 162.50, 164.93, 167.26, 168.93, 173.04, 174.97, 178.49, 180.95, 183.84, 186.21, 190.23, 192.22, 195.08, 196.97, 200.59, 204.38, 207.2, 208.98, 209, 210, 222, 223, 226, 227, 232.04, 231.04, 238.03, 237, 244, 243, 247, 247, 251, 252, 257, 258, 259, 262, 261, 262, 266, 264, 269, 268, 271, 272, 277, 0, 289, 0 ]; //molar mass table
	var list_elements = ["H","He","Li","Be","B","C","N","O","F","Ne","Na","Mg","Al","Si","P","S","Cl","Ar","K","Ca","Sc","Ti","V","Cr","Mn","Fe","Co","Ni","Cu","Zn","Ga","Ge","As","Se","Br","Kr","Rb","Sr","Y","Zr","Nb","Mo","Tc","Ru","Rh","Pd","Ag","Cd","In","Sn","Sb","Te","I","Xe","Cs","Ba","La","Ce","Pr","Nd","Pm","Sm","Eu","Gd","Tb","Dy","Ho","Er","Tm","Yb","Lu","Hf","Ta","W","Re","Os","Ir","Pt","Au","Hg","Tl","Pb","Bi","Po","At","Rn","Fr","Ra","Ac","Th","Pa","U","Np","Pu","Am","Cm","Bk","Cf","Es","Fm","Md","No","Lr","Rf","Db","Sg","Bh","Hs","Mt","Ds","Rg","Cn","Uut","Fl","Uup","Lv","Uus","Uuo"]; //element table;
	for (i=0; i<(elements_array.length); i++)
	{
		j=0;
		for (j=0; j<(list_elements.length);j++)
		{
			if (elements_array[i] == list_elements[j])
			{
				gram_mass_sum += list_molarmass[j];	
			}
		}
	}
	document.getElementById("molarmass").value = gram_mass_sum.toFixed(3);
	//var list_electronegativity = [2.20, 0, 0.98, 1.57, 2.04, 2.55, 3.04, 3.44, 3.98, 0, 0.93, 1.31, 1.61, 1.90, 2.19, 2.58, 3.16, 0, 0.82, 1.00, 1.36, 1.54, 1.63, 1.66, 1.55, 1.83, 1.88, 1.91, 1.90, 1.65, 1.81, 2.01, 2.18, 2.55, 2.96, 3.00, 0.82, 0.95, 1.22, 1.33, 1.6, 2.16, 1.9, 2.2, 2.28, 2.20, 1.93, 1.69, 1.78, 1.96, 2.05, 2.1, 2.66, 2.60, 0.79, 0.89, 1.1, 1.12, 1.13, 1.14, 1.13, 1.17, 1.2, 1.2, 1.1, 1.22, 1.23, 1.24, 1.25, 1.1, 1.27, 1.3, 1.5, 2.36, 1.9, 2.2, 2.20, 2.28, 2.54, 2.00, 1.62, 1.87, 2.02, 2.0, 2.2, 2.2,0.7, 0.9, 1.1, 1.3, 1.5, 1.38, 1.36, 1.28, 1.13, 1.28, 1.3, 1.3, 1.3, 1.3, 1.3, 1.3, 1.3, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0 ]; //electronegativity table
	
}
function changeTo()
{
	var changed = document.getElementById("convertmassunits").value;
	if (changed=="g/mol")
	{
		document.getElementById("molarmass").value = gram_mass_sum.toFixed(3);
		document.getElementById("displaymassunits").innerHTML = "grams/mole";
	}
	if (changed=="kg/mol")
	{
		document.getElementById("molarmass").value = (gram_mass_sum/1000).toFixed(6);
		document.getElementById("displaymassunits").innerHTML = "kilograms/mole";
	}
	if (changed=="g/molecule")
	{
		document.getElementById("molarmass").value = gram_mass_sum/(6.022e23);
		document.getElementById("displaymassunits").innerHTML = "grams/molecule";

	}
	if (changed=="kg/molecule")
	{
		document.getElementById("molarmass").value = (gram_mass_sum/(6.022e23))/1000;
		document.getElementById("displaymassunits").innerHTML = "kilograms/molecule";

	}
}
</script>
</head>
<body>
<h1 align="center"> Chemistry Tool </h1>
<div id="inputbox" class="bodybox">

<table>
<tr>
<td>
<input type="text" placeholder="Molecule Chemical Formula" id="Input" >
</td>
<td>
<input type="button" value="Go!" onClick="process()">
</td>
</tr>
</table>
<table>
	<tr>
        <p> Molar Mass: </p>
    </tr>
	<tr>    	
		<td>
			<input id="molarmass" placeholder="Molar Mass"> </input> 
		</td>
		<td>
			<p id="displaymassunits"> grams/mole </p>
		</td>
		<td>
			<select id="convertmassunits" onChange="changeTo()">
			<option value="g/mol"> grams/mole </option>
			<option value="kg/mol"> kilograms/mole </option>
			<option value="g/molecule"> grams/molecule </option>
			<option value="kg/molecule"> kilograms/molecule </option>
			</select>
		</td>
	</tr>
</table>
<p id="diffEN"> </p>
</div>
</body>
</html>